// 定义字符串的写法
let str: string = "hello";
let str2: string;
str2 = "乌拉";

// ts有自动类型推断
// let str3 = "world";
// str3 = 5;

// 定义数字类型
let num1: number = 5;

// 定义布尔值
let done: boolean = true;
done = false;

// 定义undefined和null
let udf: undefined = undefined;
let nl: null = null;

// 联合类型
let a: String | Number | Boolean = "5";
a = 5;
a = true;
// let b: String | null = localStorage.getItem("token");

// 定义数组
let arr1: Number[] = [1, 2, 3];
let arr2: Array<String> = ["1", "2", "3"];
let arr3: (Number | Boolean)[] = [1, true];
let arr4: Array<Number | Boolean> = [1, true];

// any任意类型
let c: any = 5;
c = () => {
  console.log(123);
};
let arr5: Array<any> = [1, true, "hello", { a: 3 }];
let arr6: any = [1, true, "hello", { a: 3 }];

let arr7 = [1, true];

// 定义元组类型
// 元组就是一个特定的数组，它可以去定义每一项的类型，以及数组的长度
const arr8: [Number, String] = [10, "20"];

// 定义枚举类型
enum Color {
  Red = 5,
  Green = 10,
  Blue,
}
console.log(Color);
let co: Color = Color.Green;
console.log(co);
let colorname: string = Color[11];
console.log(colorname);

// void表示没有类型
// 只给函数的返回值用
function fn(): void {
  console.log(123);
  // return 5;
}

// never表示从不
// 死循环或者报错
function fn2(): never {
  while (true) {}
}
function fn3(): never {
  throw new Error();
}

// 函数类型
function add(x: number, y: number): string {
  return x + y + "1";
}
add(3, 4);

const add2: (x: number, y: number) => number = function (
  x: number,
  y: number
): number {
  return x + y;
};
add2(5, 6);

// ？表示可选参数
function add3(x: number, y?: string): number | string {
  return y ? x + y : x;
}
add3(5);

// 定义对象类型
// 接口类型(我们自己去定义一种类型)
interface Person {
  name: string;
  age: number;
  // 可选参数
  phone?: number;
  // 索引签名
  [propname: string]: any;
}
const people: Person = {
  name: "zhangsan",
  age: 20,
};
people.phone = 13333333;
const people2: Person = {
  name: "lisi",
  age: 30,
  address: "123",
  likes: [299, 399, 699],
  a: 3,
  b: 4,
};

interface PropleType {
  name: string;
  age: number;
  sex?: number;
}
const peoples: PropleType[] = [
  {
    name: "zhangsan",
    age: 20,
    sex: 1,
  },
  {
    name: "lisi",
    age: 30,
  },
];

interface ChildType {
  path: string;
  components: string;
}
interface RouteType {
  path: string;
  component: string | number;
  children?: ChildType[];
}
const routes: RouteType[] = [
  {
    path: "xxx",
    component: "yyy",
    children: [
      {
        path: "abc",
        components: "nnn",
      },
    ],
  },
  {
    path: "aaa",
    component: 333,
  },
];

// 泛型
function fn11<T>(x: T, y: T) {
  return `${x}${y}`;
}
fn11<string>("3", "4");
// const [count, set_count] = useState<number>(5);

// 类
interface ObjType {
  name: string;
}
class Animal {
  constructor(obj: ObjType) {
    this.name = obj.name;
  }
  name: string = "dog";
  sayName(): string {
    return this.name;
  }
}
class Cat extends Animal {
  constructor(obj: ObjType) {
    // super用于调用父类的constructor
    super(obj);
  }
}
const cat = new Cat({
  name: "cat",
});
console.log(cat.sayName());
